<template>

	<view>

		<view>
			<view style="margin-left: 20px;margin-top: 20px;">
				<view>基本资料</view>
			</view>

			<view style="margin-left: 20px;margin-right: 20px;">

				<view class="uni-flex uni-row bg-white"
					style="margin-top: 20px;display: flex; justify-content: center; flex-direction: row;align-items: center;">
					<view class="flex-left">系统账号</view>
					<view class="flex-right">
						<uni-easyinput disabled :value="user.account" placeholder="请输入内容" style="margin: 5px;">
						</uni-easyinput>
					</view>
				</view>

				<view class="uni-flex uni-row bg-white"
					style="margin-top: 20px;display: flex; justify-content: center; flex-direction: row;align-items: center;">
					<view class="flex-left">原密码</view>
					<view class="flex-right">
						<uni-easyinput v-model="password" placeholder="请输入内容" style="margin: 5px;" type="password">
						</uni-easyinput>
					</view>
				</view>

				<view class="uni-flex uni-row bg-white"
					style="margin-top: 20px;display: flex; justify-content: center; flex-direction: row;align-items: center;">
					<view class="flex-left">新密码</view>
					<view class="flex-right">
						<uni-easyinput v-model="passwordNew" placeholder="请输入内容" style="margin: 5px;" type="password">
						</uni-easyinput>
					</view>
				</view>

				<view class="uni-flex uni-row bg-white"
					style="margin-top: 20px;display: flex; justify-content: center; flex-direction: row;align-items: center;">
					<view class="flex-left">新密码</view>
					<view class="flex-right">
						<uni-easyinput v-model="passwordNew2" placeholder="请输入内容" style="margin: 5px;" type="password">
						</uni-easyinput>
					</view>
				</view>

			</view>
		</view>

		<view
			style="bottom: 10px;display: flex;position: fixed;width: 100%;align-items: center;justify-content: center;flex-direction: row;">
			<button class="button" style="width: 60%;" type="primary" @click="Submit()">修改密码</button>
		</view>


	</view>

</template>


<script>
	import md5 from "../../util/MD5.js";



	export default {
		data() {
			return {
				user: [],
				password: '',
				passwordNew: '',
				passwordNew2: '',
				userEntity: this.StorageCache('user')
			}

		},
		onLoad() {

			this.checkLogin()


			this.Init()

		},
		methods: {
			Init() {
				this.user = []


				uni.request({
					url: this.url+'AppGetUser',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
					},
					method: 'POST',
					dataType: 'json',
					data: {
						userId: this.userEntity.sid,

					},
					success: (res) => {

						if (res.statusCode == 200) {

							this.user = res.data

			
						}
					},
					complete: (res) => {
				
					}
				});


			},
			Submit() {
				if (this.user.pwd != md5.hex_md5(this.password)) {
					uni.showToast({
						title: "当前密码不对",
						icon: 'none',
					});
					return false;
				}
				if (this.password == this.passwordNew) {
					uni.showToast({
						title: "新旧密码不得一致",
						icon: 'none',
					});
					return false;
				}
				if (this.passwordNew != this.passwordNew2) {
					uni.showToast({
						title: "两次输入的新密码不一致",
						icon: 'none',
					});
					return false;
				}
				if(!this.checkPassword(this.passwordNew) || this.passwordNew.length<=6)
				{
					uni.showToast({
						title: "密码必须有大小写字母和数字组成并且长于六位",
						icon: 'none',
					});
					return false;

				}

				uni.request({
					url: this.url+'AppUpdateBasicPassword',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
					},
					method: 'POST',
					dataType: 'json',
					data: {
						sid: this.user.sid,
						password: this.passwordNew


					},
					success: (res) => {
				
						if (res.statusCode == 200 && res.data != -1) {
							uni.showToast({
								title: "修改成功"
							});

							setTimeout(function() {
								uni.navigateTo({
									url: '/pages/cupboard/password'
								})
							}, 1000);

						}
					},
					complete: (res) => {
					
					}
				});


			},
			checkPassword:function(passWord){
				return RegExp(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/).test(passWord)
			}


		}
	}
</script>


<style>
	.flex-left {
		width: 25%;
		text-align: center;
		height: 55px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.flex-right {
		width: 80%;
		text-align: center;
		height: 55px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.flex-item {
		width: 33.3%;

		text-align: center;
		height: 55px;
		display: flex;
		align-items: center;
		justify-content: center;

	}

	.bg-white {
		background-color: #FFFFFF;
		border: 1px solid #BEBEBE;
	}
</style>
